<template>
  <view class="issue">
    <cu-custom bgColor="bg-gradual-orange" :isBack="true">
      <block slot="backText">返回</block>
      <block slot="content">意见反馈</block>
    </cu-custom>

    <form @submit='issue'>
      <view class="margin-xl padding-lg bg-white radius shadow-lg">

        <view>
          <textarea placeholder="在此输入反馈" maxlength="-1" placeholder-class='placeholder' name="issue"></textarea>
        </view>

        <view class="cu-form-group">
          <view class="grid col-3 grid-square flex-sub">
            <view class="bg-img" v-for="(item,index) in imgList" :key="index" @click="ViewImage" :data-url="imgList[index]">
              <image :src="imgList[index]" mode="aspectFill"></image>
              <view class="cu-tag bg-black" @click.stop="closeimg" :data-index="index">
                <text class="cuIcon-close text-gray "></text>
              </view>
            </view>
            <view class="solids" @click="choose" v-if="imgList.length<1">
              <text class="cuIcon-camerafill"></text>
            </view>
          </view>
        </view>
        <button class='cu-btn bg-black lg margin-top-xl flex flex-direction' form-type='submit'>反馈</button>
      </view>

    </form>
  </view>
</template>

<script>
  const accountInfo = uni.getAccountInfoSync();
  // console.log(accountInfo.miniProgram.appId); // 小程序 appId
  // console.log(accountInfo.plugin.appId); // 插件 appId
  // console.log(accountInfo.plugin.version); // 插件版本号， 'a.b.c' 这样的形式
  export default {
    data() {
      return {
        user_id: null,
        fileID:null,
        imgList: [],
        fileList: []
      }
    },
    onLoad: function(options) {
      let userInfo =getApp().globalData.userInfo;
      if (Object.keys(userInfo).length>0) {
        this.user_id = userInfo.user_id;
      } else {
        wx.navigateTo({
          url: '../login/login',
        })
      }
    },
    methods: {
      issue(e) {
        console.log(this.fileList)
        uni.vibrateShort({});
        let iss = e.detail.value.issue;
        if (iss) {
          uni.showLoading({
            title: '提交中',
          })
          wx.cloud.callFunction({
            name: 'addFeedback',
            data: {
              user_id: this.user_id,
              comment: iss,
              imgList: this.fileList
            },
            success: res => {
              uni.stopPullDownRefresh();
              uni.showToast({
                title: '反馈成功',
                icon: 'success'
              })
              uni.navigateBack({
                detal: 1
              })
            },
            fail: err => {
              uni.stopPullDownRefresh();
              uni.showToast({
                title: '问题提交失败',
                'icon': 'none',
                duration: 2000
              })
              console.error('[云函数] [addFeedback] 调用失败', err)
            }
          })
        } else {
          uni.showToast({
            title: '不能为空',
            icon: 'none'
          })
        }
      },
      choose(e) {
        uni.vibrateShort({ //使手机发生较短时间的振动
          success: function() {
            console.log('success');
          }
        });
        // let imgCount = 3-this.data.imgList.length
        uni.chooseImage({
          count: 1,
          sizeType: ['original', 'compressed'],
          sourceType: ['album'],
          success: res => {
            uni.showLoading({
              title: '上传中',
            })
            if (this.imgList.length != 0) {
              this.imgList = this.imgList.concat(res.tempFilePaths);
            } else {
              this.imgList = res.tempFilePaths;
            }
            const filePath = res.tempFilePaths[0];
            const name = Math.random() * 1000000;
            const cloudPath = 'images/issue/' + name + filePath.match(/\.[^.]+?$/)[0];
            wx.cloud.uploadFile({
              cloudPath, //云存储图片名字
              filePath, //临时路径
              success: re=> {
                uni.stopPullDownRefresh();
                console.log('[上传图片] 成功：', re)
                console.log(re.fileID);
                this.fileID = re.fileID; 
                let fileList=this.fileList;
                this.fileList = fileList.push(re.fileID); //云存储图片路径,可以把这个路径存到集合，要用的时候再取出来
                this.addImgUrl()
              },
              fail: err => {
                uni.showToast({
                  title: '图片上传失败',
                  'icon': 'none',
                  duration: 2000
                })
              }
            });

          }
        })
      },
      addImgUrl(){
        //把图片存到imgUrl集合表
        wx.cloud.callFunction({
          name: 'addUrl',
          data: {
            user_id: this.user_id,
            fileID: this.fileID
          },
          success: res => {
            uni.showToast({
              title: '图片上传成功',
              'icon': 'none',
              duration: 2000
            })
          },
          fail: err => {
            uni.showToast({
              title: '图片存储失败',
              'icon': 'none',
              duration: 2000
            })
            console.error('[云函数] [addUrl] 调用失败', err)
          }
        })
      },
      ViewImage(e) {
        uni.previewImage({
          urls: this.imgList,
          current: e.currentTarget.dataset.url
        });
      },

      closeimg(e) {
        this.imgList = [];
        this.fileList = []
      }
    }
  }
</script>

<style>
</style>
